<template>
	<div class="contact">
		<el-row class="contact-wrap">
			<el-col :span="16" :offset="4">
				<el-row class="contact-title tac"><span class="get">GET</span> IN TOUCH<br>联系我们</el-row>
				<el-row>
					<el-col :span="8">
						<p class="contact-text">+86 180-3060-5460<br>FTW475@163.COM<br>CHINA.SICHUAN.CHENGDU<br>四川省成都市青羊区<br>东华正街42号四川广电国际大厦5楼B区</p>
					</el-col>
					<el-col :span="16">
						<el-row :gutter="5" class="mt20">
							<el-col :span="12">
								<el-row :gutter="5">
									<el-col :span="12">
										<input class="text" type="text" placeholder="姓名(Name)">
									</el-col>
									<el-col :span="12">
										<input class="text" type="text" placeholder="电话(Phone)">
									</el-col>
								</el-row>
								<el-row :gutter="5" class="mt5">
									<el-col :span="12">
										<input class="text" type="text" placeholder="邮箱(Email)">
									</el-col>
									<el-col :span="12">
										<input class="text" type="text" placeholder="公司(Company)">
									</el-col>
								</el-row>
							</el-col>
							<el-col :span="12">
								<textarea class="textarea" placeholder="留言(Message)"></textarea>
							</el-col>
						</el-row>
						<el-row>
							<button class="send">SEND→</button>
						</el-row>
					</el-col>
				</el-row>
			</el-col>
		</el-row>
	</div>
</template>
<script>
	export default {
		data: function(){
			return {}
		}
	}
</script>
<style scoped>
	.contact{
		position: relative;
		height: calc(100vh - 80px);
	}
	.contact-wrap{
		width: 100%;
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
	}
	.contact-title{
		color: #deb887;
		font-size: 20px;
		margin-bottom: 30px;
	    letter-spacing: 5px;
	    line-height: 2;
	}
	.get{
		color: #333;
	}
	.contact-text{
		line-height: 2;
		margin: 0;
	}
	.text{
		width: 100%;
	    height: 40px;
		background: #323232;
	    border: none;
	    outline: none;
	    border-radius: 5px;
	    padding: 0 10px;
	    color: #fff;
	    box-sizing: border-box;
	    font-size: 18px;
	}
	.mt5{
		margin-top: 5px;
	}
	.textarea{
		width: 100%;
		height: 85px;
		background: #323232;
	    border: none;
	    outline: none;
	    border-radius: 5px;
	    padding: 10px;
	    color: #fff;
	    box-sizing: border-box;
	    font-size: 18px;
	    resize: none;
	    font-family: "微软雅黑"
	}
	.send{
		background: #c5a47e;
	    color: #fff;
	    width: 100px;
	    height: 40px;
	    text-align: center;
	    line-height: 40px;
	    border-radius: 5px;
	    float: right;
	    box-shadow: 2px 4px 10px 1px rgba(0,0,0,.5);
	    font-size: 12px;
	    letter-spacing: 2px;
	    outline: none;
	   	border: none;
	   	cursor: pointer;
	   	text-decoration: underline;
	   	margin-top: 20px;
	}
	.mt20{
		margin-top: 20px;
	}
</style>